
<template>
    <div class="ChangeTable">
        <Row>
            <Col span="24">
                <Button type="primary" class="export-btn" @click="openModal">新增申请</Button>
                <!-- <Button type="primary" class="export-btn" v-if="!isSP">导出报表</Button> -->
                <!-- <Button type="primary" class="export-btn" :disabled="resolveDisable" @click="resolve('suggestCheckF')">签约</Button>
                <Button type="primary" class="export-btn" :disabled="resolveDisable" @click="resolve('suggestRejectF')">拒绝</Button> -->
            </Col>
            <Col span="24">
                <Table
                    :columns="isSP ? contractTableHeadPartner : contractTableHead"
                    :data="contractTable.records"
                    :loading="loading"
                    border
                >
                    <template slot-scope="{ row, index }" slot="action">
                        <Button :disabled="!row.isViewBtn" type="primary" size="small" @click="showContractDetial(row)">处理</Button>

                        <Button :disabled="row.processStatus !== 'draft'" type="primary" size="small" @click="showContractDetial(row)">编辑</Button>

                        <Button :disabled="row.processStatus !== 'draft'" type="error" size="small" @click="del(row)">删除</Button>
                    </template>
                    <template slot-scope="{ row, index }" slot="applyNo">
                        <a class="applyNo" @click="showContractDetial(row,true)">{{row.applyNo}}</a>
                    </template>
                    <!-- 处理状态 -->
                    <template slot-scope="{ row, index }" slot="processStatus">
                        <span>{{getTitle('insuranceProcessStatus',row.processStatus)}}</span>
                    </template>
                    <!-- 变更主体 -->
                    <template slot-scope="{ row, index }" slot="changeSubject">
                        <span>{{getTitle('PersonRoleType',row.changeSubject)}}</span>
                    </template>
                    <!-- 来源 -->
                    <template slot-scope="{ row, index }" slot="dataSource">
                        <span>{{getTitle('dataSource',row.dataSource)}}</span>
                    </template>
                    <!-- 案件类型 -->
                    <template slot-scope="{ row, index }" slot="changeType">
                        <span>{{getTitle('CustInfoChangeType',row.changeType)}}</span>
                    </template>
                    <template slot-scope="{ row, index }" slot="businessSource">
                        <span>{{getTitle('businessSource',businessSource)}}</span>
                    </template>
                </Table>
            </Col>
            <Col span="24">
                <Row type="flex" justify="end" class="table-page">
                    <Page
                        :current="contractTable.current"
                        :transfer="true"
                        :total="contractTable.total"
                        :page-size="contractTable.size"
                        @on-change="changePage"
                        @on-page-size-change="changePageSize"
                        :page-size-opts="pageSizeOpts"
                        size="small"
                        show-total
                        show-elevator
                        show-sizer
                    ></Page>
                </Row>
            </Col>
        </Row>
    </div>
</template>
<script>
import { getTitleFromDataDict } from "_p/basic/assets/contract/js/utils";

import { delCustInfo } from "_p/basic/api/contract/post-loan-info-change";

export default {
    props: {
        formValidate: {
            type: Object,
            required: true
        },
        dataDict: {
            type: Object,
            required: true
        },
        contractTable: {
            type: Object,
            required: true
        },
        businessSource: {
            type: String,
            required: true
        },
        loading: {
            type: Boolean,
            required: true,
            default: true
        },
        isSP: {
            type: Boolean,
            required: true,
            default: true
        }
        // @showSpin="showSpin"
        // @closeSpin="closeSpin"
    },
    data() {
        return {
            // loading: false,
            selection: [],
            resolveDisable: true,
            pageSizeOpts: [10, 20, 50, 100],
            contractTableHead: [
                // {
                //     type: 'selection',
                //     width: 60,
                //     slot: "selection",
                //     align: 'center'
                // },
                {
                    title: "操作",
                    slot: "action",
                    width: 180,
                    align: "center"
                },
                {
                    title: "申请编号",
                    key: "applyNo",
                    // slot: "applyNo",
                    width: 150,
                    render: (h, params) => {
                        return h('Tooltip', {
                            props: {
                                content: params.row.applyNo,
                                transfer: true,
                                hideOnClick:true
                            }
                        }, [h('a', {
                            class: 'applyNo',
                            style: {
                                width: (params.column._width - 38) + 'px',
                            },
                            on: {
                                click: () => {
                                    setTimeout(()=>{ this.showContractDetial(params.row, true) },100)
                                }
                            }
                        }, params.row.applyNo)])
                    }
                },
                {
                    title: "合同号",
                    key: "contractNo",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "客户姓名",
                    key: "custName",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 100,
                },
                {
                    title: "处理状态",
                    key: "processStatus",
                    minWidth: 100,
                    ellipsis: true,
                    tooltip: true,
                    slot: "processStatus"
                },
                {
                    title: "变更主体",
                    key: "changeSubject",
                    slot: "changeSubject",
                    minWidth: 100,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: "申请时间",
                    key: "applyDate",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "结束时间",
                    key: "endDate",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "变更类型",
                    key: "changeType",
                    slot: "changeType",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "来源",
                    key: "dataSource",
                    slot: "dataSource",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 100,
                },
                {
                    title: "业务来源",
                    key: "businessSource",
                    slot: "businessSource",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
            ],
            contractTableHeadPartner: [
                // {
                //     type: 'selection',
                //     width: 60,
                //     align: 'center'
                // },
                {
                    title: "操作",
                    slot: "action",
                    width: 180,
                    align: "center"
                },
                {
                    title: "申请编号",
                    key: "applyNo",
                    // slot: "applyNo",
                    width: 150,
                    render: (h, params) => {
                        return h('Tooltip', {
                            props: {
                                content: params.row.applyNo,
                                transfer: true
                            }
                        }, [h('a', {
                            class: 'applyNo',
                            style: {
                                width: (params.column._width - 38) + 'px',
                            },
                            on: {
                                click: () => {
                                    this.showContractDetial(params.row, true)
                                }
                            }
                        }, params.row.applyNo)])
                    }
                },
                {
                    title: "客户姓名",
                    key: "custName",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 100,
                },
                {
                    title: "处理状态",
                    key: "processStatus",
                    minWidth: 100,
                    ellipsis: true,
                    tooltip: true,
                    slot: "processStatus"
                },
                {
                    title: "变更主体",
                    key: "changeSubject",
                    slot: "changeSubject",
                    minWidth: 100,
                    ellipsis: true,
                    tooltip: true,
                },
                {
                    title: "申请时间",
                    key: "applyDate",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "结束时间",
                    key: "endDate",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
                {
                    title: "业务来源",
                    key: "businessSource",
                    slot: "businessSource",
                    ellipsis: true,
                    tooltip: true,
                    minWidth: 150,
                },
            ]
        };
    },
    mounted() { },
    methods: {
        init() { },
        // 分页 Fn
        changePageSize(num) {
            this.$emit(
                "getList",
                Object.assign({}, this.formValidate, { pageSize: num })
            );
            this.formValidate.pageSize = num;
        },
        changePage(num) {
            this.$emit(
                "getList",
                Object.assign({}, this.formValidate, { pageNumber: num })
            );
            this.formValidate.pageNumber = num;
        },
        showContractDetial(row, isReadOnly) {
            this.$emit("showContractDetial", row, isReadOnly);
        },
        getTitle(type, val) {
            let data = this.dataDict[type + "Dict"] || [];
            return getTitleFromDataDict(data, val);
        },
        del(row) {
            if (!row.contractNo) return;
            this.$Modal.confirm({
                title: "确认删除？",
                onOk: () => {
                    this.deleteQuery(row.caseNo);
                }
            });
        },
        deleteQuery(caseNo) {
            delCustInfo(caseNo).then(res => {
                this.loading = false;
                if (res.code === "0000") {
                    // this.contractTable = res.data;
                    this.$Message.success(res.data);
                    this.$emit("getList", this.formValidate);
                }
            });
        },
        openModal() {
            this.$emit("showModal", true);
        },
        onSelectionChange(selection) {
            console.log(selection, 'selection');
            if (selection && selection.length > 0) {
                this.resolveDisable = false
            }
            this.selection = selection
        },
        // 提交（suggestCheckF），拒绝（suggestRejectF）
        resolve(name) {
            this.$Modal.confirm({
                title: `确认提交？`,
                onOk: () => {
                    this.showSpin();
                    this.passOrReject(name)
                }
            });
        },
        // 一键提交 请求
        passOrReject(type) {
            let d = { approvalOperating: type, bankCardManageVOs: this.selection }
            // passOrReject(d).then(res => {
            //     this.closeSpin()
            //     if (res.code === "0000") {
            //         this.$Message.success("成功")
            //     }
            // }).catch(e => {
            //     console.error(e);
            //     this.closeSpin()
            // })
        },
        showSpin() {
            this.$emit("showSpin");
        },
        closeSpin() {
            this.$emit("closeSpin");
        },
    }
};
</script>
<style scoped>
.export-btn {
    margin-bottom: 16px;
}
</style>
